<template>
  <div>
    <loading></loading>
    <vueTop></vueTop>
    <Addarticle v-if="addbbsctx_bool">
      <div slot="addtitle"><h4>请输入帖子信息:</h4></div>
      <div slot="addbbsctx">
        <b-form @reset="clearFiles" @submit.prevent="artcileupload">
          <b-form-file v-model="file" :state="Boolean(file)" placeholder="Choose a file..." ref="fileinput" @change="selFile($event)"></b-form-file>
          <div class="mt-4" :style="{marginLeft:'0.9375rem',}">
            <!--选择的文件{{file && file.name}}-->
          </div>
          <b-container class="bv-example-row">
            <b-row>
              <b-col sm="4" :style="{marginBottom:'1.25rem'}">
                <span :style="{fontSize:'1rem'}">封面</span>
              </b-col>
              <b-col sm="8">
                <b-form-input  type="text" v-model="file.name"></b-form-input>
              </b-col>
            </b-row>
            <b-row>
              <b-col sm="4" :style="{marginBottom:'1.25rem'}">
                <span :style="{fontSize:'1rem'}">标题</span>
              </b-col>
              <b-col sm="8">
                <b-form-input  type="text" v-model="article.topic"></b-form-input>
              </b-col>
            </b-row>
            <b-row>
              <b-col sm="4" :style="{marginBottom:'1.25rem'}">
                <span :style="{fontSize:'1rem'}">内容</span>
              </b-col>
              <b-col sm="8">
                <textarea class="form-control" rows="5" name=textarea v-model="article.ctx"></textarea>
              </b-col>
            </b-row>
          </b-container>
          <b-button type="reset" :style="{width:'5rem',backgroundColor:'#575757',marginLeft:'3rem',marginTop:'0.9375rem'}">重选</b-button>
          <b-button type="submit" :style="{width:'5rem',backgroundColor:'#575757',marginLeft:'0.625rem',marginTop:'0.9375rem'}">上传
          </b-button>
        </b-form>
      </div>
      <div slot="addbbsfooter">
        <button type="button" class="btn btn-default" @click="closeaddartic">关闭</button>
      </div>
    </Addarticle>
    <foodBBSChild v-if="bbsctx_bool">
      <div slot="bbstitle">
        <h3>{{bbs_child.topic}}</h3>
        <div :style="{width:'780px'}">
          <p :style="{fontSize:'14px',float:'left',marginLeft:'300px'}">作者：{{bbs_child.user}}</p>
          <p :style="{fontSize:'14px',float:'left',marginLeft:'20px'}">发布时间：{{bbs_child.publictime}}</p>
          <p :style="{fontSize:'14px',float:'left',marginLeft:'20px'}">点赞数：{{bbs_child.admirnum}}</p>
        </div>
      </div>
      <div slot="bbsctx">
        <div :style="{fontSize:'18px'}"><p>{{bbs_child.context}}</p></div>
        <div class="balckline"></div>
        <p>用户评论:</p>
        <div v-for="(item,index) in item2s" :key="index" >
          <p>{{item.user}}   时间：{{item.time}} 楼层：{{item.local}}</p>
          <p :style="{fontSize:'15px',float:'left',width:'700px'}">
            {{item.ctx}}
            <a :style="{float:'right',color:'#336699'}" @click.native="jump(index)">回复</a>
            <a :style="{float:'right'}" @click="deletreview(index)" v-if="item.usercombool">删除</a>
          </p>
        </div>
        <div class="input-group mb-3" :style="{width:'700px',marginLeft:'20px',paddingTop:'20px',zIndex:'1'}">
          <input type="text" class="form-control" placeholder="请输入" aria-describedby="recommend" v-model="selectarticle.recomctx">
          <div class="input-group-append">
            <span class="input-group-text"  id="recommend" @click="myreview">回复</span>
          </div>
        </div>
      </div>
      <div slot="bbsfooter">
        <button type="button" class="btn btn-default" @click="closeartic">关闭</button>
      </div>
    </foodBBSChild>
    <div class="BBS_leftab">
      <div id="BBSearch_box">
        <div id="BBS_search">
          search
        </div>
      </div>
      <div id="BBS_hblank"></div>
      <div class="BBS_return">
        <input type="button" value="发帖"  id="btn3" class="return_btn" @click="openaddarticle"/></div>
      <div class="BBSLtab_head">
        美食论坛
      </div>
    </div>
    <div class="BBS_box">
      <div class="BBS_context">
        <div id="BBSimg_box">
          <img src="../assets/gps-3.jpeg" id="BBS_img"/>
          <div class="hotarticle">
            <h3>{{hotarticle.topic}}</h3>
            <h4>{{hotarticle.context}}</h4>
          </div>
        </div>
        <div class="moremes">
          <button @click="getwoart">更多文章</button>
        </div>
        <div class="table_bbs">
          <table class="BBS_article" width="800px">
            <tr>
              <th class="BBS_head"><h2>最新</h2></th>
            </tr>
            <tr v-for='(item,index) in items' :key = index class="BBS_topic" >
              <td class="topic_box" width="400px" @click="gotoctx(index)">
                <p><span class="glyphicon glyphicon-arrow-up" :style="{color:'black'}"></span>{{item.topic}}</p>
              </td>
              <td class="topic_box" width="400px" @click="gotoctx2(index)">
                <p><span class="glyphicon glyphicon-arrow-up" :style="{color:'black'}"></span>{{item.topic2}}</p>
              </td>
            </tr>
          </table>
        </div>
      </div>
    </div>
  </div>
</template>

<script src="../js/foodBBS.js"></script>
<style scoped>
  @import "../css/foodBBS.css";
</style>
